<template>
  <div class="imgList">
    <div class="pageHeader">
      图集
      <img src="@/static/images/arrow-left.png" alt="" @click="back">
    </div>
    <van-tabs v-model="type" @change="getImgList">
      <van-tab title="球场图集">
        <div class="container acea-row ">
          <img class="item" v-for="(item,index) in list" :key="index" :src="config.baseUrl_xbq+item.url" alt="">
        </div>
      </van-tab>
      <van-tab title="会所/酒店图集">
        <div class="container acea-row ">
          <img class="item" v-for="(item,index) in list" :key="index" :src="config.baseUrl_xbq+item.url" alt="">
        </div>
      </van-tab>
    </van-tabs>
  </div>
</template>

<script>
import api from "api"
import config from "api/config"
import axios from 'axios'
import { Toast } from 'vant'

export default {
  data() {
    return {
      type:0,
      list:[],
      config
    }
  },
  created() {
    this.type = this.$route.params.type - 1
    this.getImgList()
  },
  methods: {
    getImgList(){
      Toast.loading({
        message:"加载中...",
        duration:0
      })
      let that = this
      let type = (parseInt(this.type) + 1).toString()
      let club_id = this.$route.params.id
      api.post("/index/clubImageList",{
          club_id, 
          tags: type
        }).then(e=>{
          Toast.clear()
          that.list = e.data
      })
    },
    back(){
      this.$router.go(-1);//返回上一层
    },
  },
  computed:{
    storeData(){
      return this.$store.state.common.storeData
    },
  }
}
</script>

<style scoped>
  .imgList{
    min-height: 100vh;
    background-color: #f2f3f5;
  }
  .container{
    padding: 20px;
  }
  .container .item{
    width: 220px;
    height: 220px;
    margin-bottom: 25px;
    margin-right: 25px;
  }
  .container .item:nth-child(3n){
    margin-right: 0px;
  }
</style>